@import "partials/mixins";
#map {
    height: 100%;
    width: 100%;
    background-color: #252526;
    overflow: hidden;
  
    .adventrueInfo {
        height: ptr(140px);
        color: #fff;
        text-align: center;
        .title {
            font-size: ptr(14px);
            position: relative;
            display: inline-block;
            &::before {
                content: '';
                position: absolute;
                left: ptr(-40px);
                top: 49%;
                width: ptr(30px);
                height: ptr(1px);
                background-color: #fff;
            }
            &::after {
                content: '';
                position: absolute;
                right: ptr(-40px);
                top: 49%;
                width: ptr(30px);
                height: ptr(1px);
                background-color: #fff;
            }
        }
        .boxContent {
            padding: 0 ptr(20px);
            height: ptr(100px);
            overflow-y: auto;
        }
    }
   
    .mapContent {
        position: relative;
        height: ptr(440px);
    }
   
    .progress {
        display: block;
        border: ptr(3px) solid #403F3F;
        background-color: #060E11;
        width: ptr(120px);
        height: ptr(24px);
        line-height: ptr(24px);
        box-sizing: content-box;
        color: #ccc;
        position: relative;
        text-align: center;
        font-size: ptr(15px);
        &::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            width: 0;
            background: #999;
            opacity: 0.6;
            animation: progressAnimation 1.5s infinite linear;
        }
    }
    .mapBoxType {
        width: 100%;
        height: ptr(70px);
    }
}